import { OneModal } from '@/components/one-ui';
import { IOneModalRef } from '@/pages/type';
import { history } from 'umi';
import { getKeyRouter, onCloseModalCommon } from '@/utils';
import { Form, message, Spin, Table } from 'antd';
import { Ref, useEffect, useRef } from 'react';
import { GatherModalManageTableColumns } from '../mconfig';
import { getGatherListSev, deletGatherListSev } from '../services';
import { commonPageSizeOptions, showTotalInfo } from '@/common/constVariable';

export const GatherModal = ({ curRes, onCloseModal }) => {
  /**
   * modal ref
   */
  const GatherModalRef: Ref<IOneModalRef> = useRef(null);

  /**
   * 获取折旧记录
   * */
  const { getGatherListFun, getGatherListLoading, otherParams, gatherList, pagination, reloadRequest } = getGatherListSev((res: Record<string, any>) => {
    if (res && res?.msgFlag) {
      message.success(res?.msg);
    } else {
      message.error(res?.msg);
    }
  }, curRes);

  /**
   * 删除折旧记录
   * */
  const { deletGatherListRun, deletGatherListLoading } = deletGatherListSev((res) => {
    if (res && res?.msgFlag) {
      message.success(res?.msg);
      reloadRequest();
    } else {
      message.error(res?.msg);
    }
  });

  /**
   * 保存
   */
  const onGatherModalOk = () => {
    onCloseModalCommon(GatherModalRef);
  };

  /**
   * 关闭
   * */
  const onClose = () => {
    onCloseModal();
  };

  /**
   * 表格分页方法
   * */
  const onTableChangePage = (current: number, pageSize: number) => {
    getGatherListFun({ current, pageSize });
  };

  /**
   * 确认删除
   * */
  const onSaveDelGather = (record) => {
    deletGatherListRun(record);
  };

  /**
   * 跳转明细
   * */
  const onClickDepreciationDate = (record) => {
    onCloseModalCommon(GatherModalRef);
    // 跳转详情页面
    history.push({
      pathname: `/assetDepreciationCalculation/detail/:${getKeyRouter()}${getKeyRouter()}`,
      state: {
        record,
      },
    });
  };

  return (
    <>
      <OneModal
        open={true}
        ref={GatherModalRef}
        title={'折旧记录'}
        width={document.body.clientWidth * 0.55}
        onCancel={onClose}
        bodyStyle={{
          padding: '5px 0px',
          height: document.body.clientHeight * 0.65,
        }}
        centered
        onOk={onGatherModalOk}
        confirmLoading={getGatherListLoading || deletGatherListLoading}
      >
        <Spin spinning={getGatherListLoading || deletGatherListLoading}>
          <div className="list-table">
            <Table
              size="small"
              bordered={true}
              dataSource={gatherList}
              scroll={{ x: 'auto', y: 'auto' }}
              columns={GatherModalManageTableColumns({ onDeleteFun: onSaveDelGather, onSkipFun: onClickDepreciationDate })}
              pagination={{
                ...pagination,
                showTitle: false,
                showQuickJumper: true,
                showSizeChanger: true,
                pageSizeOptions: commonPageSizeOptions,
                showTotal: showTotalInfo,
                onChange: onTableChangePage,
                // pageSize: pagination?.pageSize,
                // current: pagination?.current,
                // total: pagination?.total,
              }}
            />
          </div>
        </Spin>
      </OneModal>
    </>
  );
};
